<template>
  <div>
    <ul>
      <li
        style="padding: 20px;"
        :class="index !== listData.length - 1 ? 'classify-li' : ''"
        v-for="(item,index) in listData"
        :key="index"
      >
        <el-row>
          <el-col :span="12">
            <p>
              项目名称：
              <span>{{ item.evalItemName }}</span>
            </p>
          </el-col>
          <el-col :span="12">
            <span>
              事件数：
              <i>{{ item.evalTaskEventVOList.length }}</i>个
            </span>
            <el-button type="text" @click="handleDetail(item)">详情</el-button>
            <el-divider direction="vertical" />
            <el-button type="text">历史</el-button>
            <el-divider direction="vertical" />
            <el-button type="text" @click="handleAdd(item)">新增</el-button>
          </el-col>
          <el-col :span="12">
            <p>
              项目内容：
              <span>正常考评选择项</span>
            </p>
          </el-col>
          <el-col :span="12">
            <p>
              考核标准：
              <span>{{ item.standard }}</span>
            </p>
          </el-col>
          <el-col :span="12">
            <p class="mb0">
              项目分值：
              <span>{{ item.rewardStandard }}</span>分
            </p>
          </el-col>
          <el-col :span="12">
            <p class="mb0">
              得分：
              <span>{{ item.itemScore }}</span>分
            </p>
          </el-col>
        </el-row>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  props: {
    list: {
      type: Array
    }
  },
  watch: {
    list: {
      handler(n, o) {
        console.log('list new', n)
      }
    }
  },
  created() {
    this.listData = this.list
  },
  data() {
    return {
      listData: []
    }
  },
  methods: {
    handleAdd(item) {
      this.$router.push({
        name: 'evaluateStartCreateTest',
        params: { item }
      })
    },
    handleDetail(item) {
      this.$router.push({
        name: 'evaluateStartTestDetail',
        params: { item }
      })
    }
  }
}
</script>

<style scoped>
.classify-li {
  border-bottom: 1px solid #ccc;
}
</style>
